<template>
  <div>
    <VueUeditorWrap v-model="message" :config="myConfig" />
  </div>
</template>
<script>
import VueUeditorWrap from 'vue-ueditor-wrap'
export default {
  name: 'UEditor',
  components: {
    VueUeditorWrap,
  },
  data() {
    return {
      message: '',
      myConfig: {
        // 编辑器不自动被内容撑高
        autoHeightEnabled: false,
        // 初始容器高度
        initialFrameHeight: this.ueHeight,
        // 初始容器宽度
        initialFrameWidth: this.ueWidth,
        // 上传文件接口
        serverUrl: '',
        UEDITOR_HOME_URL: '/UEditor/',
      },
    }
  },
  watch: {
    defaultMsg(val) {
      this.message = val
    },
    clear(flag) {
      if (!flag) this.message = ''
    },
  },
  props: {
    //编辑器高度
    ueHeight: {
      type: Number,
      default: 200,
    },
    //编辑器宽度
    ueWidth: {
      type: Number,
      default: 820,
    },
    //编辑器默认值
    defaultMsg: {
      type: String,
      default: '',
    },
    clear: Boolean,
  },
  mounted() {
    this.message = this.defaultMsg
  },
}
</script>
